<template>
    <view v-if="is_show" class="goods-vip" :style="{'margin': `${margin}`}">
        <image src="/static/image/icon/svip.png"></image>
        <view class="item vip-right cross-center">{{vipText}}</view>
    </view>
</template>

<script>

	import {mapState} from 'vuex';
	
    export default {
        name: "app-sup-vip",
	    props: {
            discount: {
                type: String,
	            default() {
                    return null;
                }
            },
            is_vip_card_user: {
                type: Number,
                default() {
                    return 0;
                }
            },
            margin: {
                type: String,
	            default() {
                    return '0';
	            }
            },
            new_icon: Boolean
	    },
        data() {
            return {
                is_show: false,
            }
        },
        created() {
            let that = this;
            if(that.is_vip_card_user == 1) {
                if(that.mall.setting.is_show_super_vip == '1'){
                    that.is_show = true;
                }else {
                    that.is_show = false;
                }
            }else {
                if(that.mall.setting.is_show_normal_vip == '1'){
                    that.is_show = true;
                }else {
                    that.is_show = false;
                }
            }
        },
	    computed: {
            ...mapState({
                mall: state => state.mallConfig.mall,
                userInfo: state => state.user.info,
            }),
			vipText() {
				return this.priceUnit(this.discount, '折', 'after');
			}
	    }
    }
</script>

<style scoped lang="scss">
    .goods-vip {
        width: 130rpx;
        height: 32rpx;
        position: relative;
        font-weight: 600;
        flex-shrink: 0;
        image {
            width: 100%;
            height: 100%;
            display: block;
        }
        view {
            font-size: 20rpx;
            color: #171718;
            line-height: 1;
            height: 32rpx;
            position: absolute;
            right: 8rpx;
            top: 0;
            z-index: 2;
        }
        .item {
            font-size: 600;
        }
    }
</style>